<template>
<div>
  <div class="subject" v-for="(item,index) in arr" :key='index'>
    <span>{{item.num1}}</span>
    <span>+</span>
    <span>{{item.num2}}</span>
    <span>=</span>
    <input type="number" v-model='item.result'/>
    <button @click='sum(index)'>提交</button>
  </div>
  </div>
</template>
  
  <script>
export default {
  data(){
    return {
      newarr:[]
    }
  },
  methods: {
    sum(index) {
      this.newarr = this.arr
      if (this.arr[index].result == "") {
        this.newarr[index].status = "未作答"
        console.log(this.newarr[index].status)
        return
      }
      if (
        this.arr[index].result == this.arr[index].num1 + this.arr[index].num2
      ) {
        this.newarr[index].status = "正确";
        console.log(this.newarr[index].status);
      } else {
        this.newarr[index].status = "错误";
        console.log(this.newarr[index].status);
      }
      console.log(777);
      this.$emit('ss',this.newarr)
    },
  },
  props:{
    arr:{
      type:Array,
    }
  },
};
</script>
  
  <style scoped>
.subject {
  margin: 5px;
  padding: 5px;
  font-size: 20px;
}
.subject span {
  display: inline-block;
  text-align: center;
  width: 20px;
}
.subject input {
  width: 50px;
  height: 20px;
}
</style>